<template>
	<view>
		<!-- @click="zuanlan(item,index)" v-for="(item,index) in 4" -->
		<view class="body"  @click="zuanlan(data)">
			<view class="body_text" :style="{
					'margin': index!=0?'20rpx 0 20rpx 0':'20rpx 0 20rpx 0'
				}">
				{{data.guide}}
			</view>
			<view class="body_a">
				<image style="width:35%; height:240rpx;border-radius: 8rpx;" :src="data.logo_image" />
				<view class="body_b">
					<view class="body_b_1">{{data.name}}</view>
					<view class="body_b_2">{{data.synopsis}}</view>
				</view>
			</view>
			<view class="xian" v-if="index!=1" />
		</view>
	</view>
	</view>

</template>

<script>
	export default {
		props: ['data', 'index'],
		data() {
			return {}
		},
		methods: {
			zuanlan(a, index) {
				this.$emit('onzuanlan',a)
				// uni.navigateTo({
				// 	url: `/pages/specialcolumn/xiangqing?type=${index+1}`
				// });
			},
		}
	}
</script>
<style lang="scss">
	.huibiao {
		margin-right: 15rpx;
		width: 50rpx;
		height: 50rpx;
		position: relative;
		background-image: url(https://s4.ax1x.com/2022/01/13/7QNFjP.png);
		background-size: 100%;

		.badge {}
	}

	.topt {
		display: flex;
		width: 90%;
		margin: auto;
		position: relative;
		margin-top: 10rpx;
		justify-content: space-between;
	}

	::-webkit-scrollbar {
		display: none;
	}

	.input {
		height: 68rpx;
		background-image: url(https://s4.ax1x.com/2022/01/13/7QPk1x.png);
		background-size: 100%;
		border-top: 2px solid #141414;
		border-bottom: 2px solid #141414;
		border-left: 4px solid #141414;
		border-right: 4px solid #141414;
	}

	.wrap {
		padding: 0 40rpx 40rpx 40rpx;
	}

	.body {
		.body_text {
			font-size: 22rpx;
			font-family: Source Han Sans CN;
			font-weight: 400;
			line-height: 33rpx;
			color: #91969A;
			opacity: 1;
			// 
		}

		.body_a {
			display: flex;
		}

		.body_b {
			width: 60%;

			.body_b_1 {
				font-size: 30rpx;
				font-family: Source Han Sans CN;
				font-weight: bold;
				line-height: 44rpx;
				color: #333333;
				opacity: 1;
				margin-left: 20rpx;
			}

			.body_b_2 {
				margin-left: 20rpx;
				font-size: 26rpx;
				font-family: Source Han Sans CN;
				font-weight: 400;
				line-height: 39rpx;
				color: #333333;
				text-align: justify;
				margin-top: 10rpx;
				opacity: 1;
			}
		}
	}

	.zhibobg {
		width: 100%;
		background: rgba(248, 248, 250, 0.6);

	}

	.xian {
		height: 1px;
		background: #EFEFEF;
		opacity: 1;
		margin-top: 30rpx;
		// margin-bottom: 30rpx;
	}

	.zhibo {
		width: 90%;
		margin: auto;

		.shipinkecheng {
			width: 100%;
			display: flex;
			overflow-x: auto;
			display: -webkit-box;
			overflow-y: hidden;



		}

		.shipinkecheng_1 {
			margin-right: 15rpx;
		}

		.shipinkecheng_2 {
			font-size: 30rpx;
			font-family: Source Han Sans CN;
			font-weight: bold;
			line-height: 45rpx;
			color: #333333;
			opacity: 1;
		}

		.shipinkecheng_3 {
			font-size: 22rpx;
			font-family: Source Han Sans CN;
			font-weight: 400;
			line-height: 45rpx;
			color: #91969A;
			opacity: 1;
		}

		.guanggao1 {
			.left {
				.left_1 {
					font-size: 34rpx;
					font-family: Source Han Sans CN;
					font-weight: bold;
					line-height: 45rpx;
					color: #333333;
					opacity: 1;
				}

				.left_2 {
					font-size: 28rpx;
					font-family: Source Han Sans CN;
					font-weight: 400;
					line-height: 45rpx;
					color: #91969A;
					opacity: 1;
				}

				.left_3 {
					display: flex;
					font-size: 22rpx;
					font-family: Source Han Sans CN;
					font-weight: 400;
					line-height: 45rpx;
					color: #141414;
					opacity: 1;
				}

				.left_4 {
					width: 200rpx;
					height: 58rpx;
					text-align: center;
					background: #FFE100;
					opacity: 1;
					border-radius: 8rpx;
					font-size: 28rpx;
					font-family: Source Han Sans CN;
					font-weight: 500;
					line-height: 58rpx;
					color: #703F00;
					opacity: 1;
				}
			}
		}
	}

	.bottom {
		margin-bottom: 50rpx;
	}

	.zhibo_1 {

		display: flex;
		margin-top: 20px;
		justify-content: space-between;

		.zhibo_text {
			margin-left: 10rpx;
			font-size: 24rpx;
			font-family: Source Han Sans SC;
			font-weight: 400;
			color: #141414;
			opacity: 1;
		}

		.zhibo_time {
			margin-left: 10rpx;
			background-color: rgb(245, 77, 87);
			padding: 0 15rpx 0 15rpx;
			border-radius: 20rpx 0 20rpx 0;
			font-size: 24rpx;
			font-family: Source Han Sans CN;
			font-weight: 500;
			line-height: 0px;
			color: #FFFFFF;
			opacity: 1;
		}

		.zhibo_1_t {
			font-size: 42rpx;
			font-family: Source Han Sans CN;
			font-weight: bold;
			color: #141414;
			opacity: 1;
		}

		.zhibo_2_t {
			font-size: 24rpx;
			font-family: Source Han Sans CN;
			font-weight: 400;
			color: #91969A;
			line-height: 70rpx;
			opacity: 1;
		}

	}

	.gg {
		width: 90%;
		margin: auto;
	}

	.all {
		// margin-bottom: 30px;
		display: flex;
		width: 100%;
		justify-content: space-around;
	}

	.imageall {
		text-align: center;

		.imagealltext {
			font-size: 24rpx;
			font-family: Source Han Sans CN;
			font-weight: 500;
			color: #141414;
			margin-top: 20rpx;
			opacity: 1;
		}
	}

	.top_img {
		width: 53px;
		height: 30px;
	}

	.content {
		// display: flex;
		// flex-direction: column;
		// align-items: center;
		// justify-content: center;
	}
</style>
